.banner {
    width: 100%;
    max-width: 1000px;
    margin: 24px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0 10px 20px;
    background-color: #333;
    border-radius: 8px;
    box-sizing: border-box;
    // border: solid 2px var(--text);

    p {
        margin: 0;
        color: var(--flip-text);
        font-size: 0.8em;
        font-weight: medium;
    }

    a {
        color: var(--flip-text);
        text-decoration: underline;
    }

    button {
        position: relative;
        padding: 0;
        margin: 0 20px;
        font-size: 0;
        width: 14px;
        height: 14px;
        min-width: 14px;
        min-height: 14px;
        background-color: transparent;

        &::before,
        &::after {
            position: absolute;
            content: "";
            top: calc(50% - 1px);
            left: 0%;
            width: 100%;
            height: 2px;
            background-color: #fff;
            transform: rotateZ(-45deg);
            opacity: 1;
        }

        &::after {
            transform: rotateZ(45deg);
        }

        &:hover {

            &::before,
            &::after {
                opacity: 1;
            }
        }
    }
}